<template>
  <div>
    <el-dialog
      :title="title"
      :visible.sync="dialogFlag"
      class="avue-dialog avue-dialog--top"
      width="60%"
      @close="cancel">
      <div style="margin: 10px 0">
        <el-form  :rules="rules" ref="ruleForm" :model="dataForm" :before-close="disableClose" label-width="100px" class="product-form">
          <el-row>
            <el-col :span="8">
              <el-form-item label="点位编码:" prop="pointCode">
                <el-input v-model="dataForm.pointCode" size="small" placeholder="请输入点位编码"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="点位名称:" prop="pointName">
                <el-input v-model="dataForm.pointName" size="small" placeholder="请输入点位名称"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="单位:" prop="unit">
                <el-input v-model="dataForm.unit" size="small" placeholder="请输入单位"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="8">
              <el-form-item label="转换公式:" prop="formula">
                <el-input v-model="dataForm.formula" size="small" placeholder="请输入转换公式"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="数据类型:" prop="dataType">
                <el-select v-model="dataForm.dataType" style="width: 100%;" size="small" placeholder="请选择数据类型">
                  <el-option
                    v-for="item in dataTypeDict"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="是否启用:" prop="isEnable">
                <el-switch
                  v-model="dataForm.isEnable"
                  active-text="已启用"
                  :active-value="1"
                  :inactive-value="0"
                  inactive-text="未启用">
                </el-switch>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </div>

      <div style="float: right">
        <el-button size="small" @click="cancel">取 消</el-button>
        <el-button size="small" @click="savePoint" type="primary">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {submit, detail} from '@/api/cps/equipment-point-api'
export default {
  name: "OpcdaDialog",
  data() {
    return {
      title: '点位信息',
      dialogFlag: false,
      dataForm: {},
      // 判断写指令是否必填
      isWrite: true,
      dataTypeDict: [],
      rules: {
        pointCode: [
          {
            required: true,
            message: "请输入点位编码",
            trigger: 'blur'
          },
        ],
        pointName: [
          {
            required: true,
            message: "请输入点位名称",
            trigger: 'blur'
          }
        ],
        unit: [
          {
            required: true,
            message: "请输入单位",
            trigger: 'blur'
          }
        ],
        formula: [
          {
            required: true,
            message: "请输入转换公式",
            trigger: 'blur'
          }
        ],
        dataType: [
          {
            required: true,
            message: "请选择数据类型",
            trigger: 'blur'
          }
        ],
      },
    }
  },
  mounted() {

    this.dataTypeDict = this.$store.state.dict.dictDatas.opc_point_data_type

  },
  methods: {
    disableClose() {
      this.dataForm = {};
      this.dialogFlag = false;
    },
    addPoint(id){
      this.dataForm.quantity = 1
      this.dataForm.equipmentId = id;
      this.dialogFlag = true;
    },
    editPoint(data){
      this.dialogFlag = true;
      this.getDetail(data.id)
      if (this.dataForm.writeInstruction === -1){
        this.dataForm.writeInstruction = "";
      }
    },
    savePoint() {
      this.$refs["ruleForm"].validate((valid) => {
        if (valid) {
          this.dataForm.agreementType = 'OPC DA'
          submit(this.dataForm).then(res => {
            const {msg} = res;
            if (res.code === 0) {
              this.$message.success("操作成功")
              this.cancel();
            } else {
              this.$message.warning(msg);
            }
          })
        }
      })
    },
    cancel() {
      this.dialogFlag = false;
      this.dataForm = {};
      this.$refs['ruleForm'].clearValidate();
      this.$emit('restOnLoad');
    },
    getDetail(id) {
      detail(id).then(res => {
        this.dataForm = res.data;
      })
    },
  }
}
</script>

<style scoped>
.product-form ::v-deep .el-form-item__label {
  color: #3f4448;
  font-weight: 400;
}
</style>
